﻿@using HotelManageSystem.Models

@{
    ViewBag.Title = "ClientConsumptionManage";
    Layout = "~/Views/Shared/_Template3.cshtml";
}
@section Head{
    <link href="../../Content/TelerikGrid.css" rel="stylesheet" type="text/css" />
}
@{    <h3>房间信息</h3>
         Html.Telerik().Grid((IEnumerable<RoomInfoModel>)ViewData["room"])        .Name("Room")        //.TableHtmlAttributes(new { style = "width:800px" })        .Columns(columns =>        {            columns.Bound(e => e.ID).Width(100).Title("房间编号").HtmlAttributes(new {style="text-align:center"});
            columns.Bound(e => e.Name).Width(100).Title("客房名称").HtmlAttributes(new {style="text-align:center"});
            columns.Bound(e => e.BedNum).Width(100).Title("客床数量").HtmlAttributes(new {style="text-align:center"});
            columns.Bound(e => e.FloorName).Width(100).Title("楼层").HtmlAttributes(new {style="text-align:center"});
            columns.Bound(e => e.RoomStateName).Width(100).Title("房间状态").HtmlAttributes(new {style="text-align:center"});
            columns.Bound(e => e.RoomTypeName).Width(100).Title("房间类型").HtmlAttributes(new {style="text-align:center"});
        })        .Pageable(page=>page.PageSize(5))        .Sortable()        .Selectable()
        .DataBinding(dataBinding => dataBinding.Ajax().Select("ShowAllRoom", "ClientConsumption"))        .ClientEvents(events => events.OnRowSelect("onRowSelected"))        .RowAction(row =>        {
            row.Selected = row.DataItem.ID.Equals(ViewData["roomId"]);        })
        .Scrollable(scroll => scroll.Height(150))        .Filterable()        .Render();}@{        <h3>消费详情 (<span id="room">客房编号：@ViewData["roomId"]</span>)</h3>
    Html.Telerik().Grid((IEnumerable<ClientConsumptionInfoModel>)ViewData["clientConsumption"])
    .Name("clientConsumptionDetails")
    .DataKeys(keys => keys.Add(c => c.ID))
    .ToolBar(tool => tool.Template(@<text><span id="sumAccount">消费总价：￥@ViewData["sumAccount"] 元</span></text>))           .Columns(columns =>        {
            columns.Bound(r => r.ID).Title("消费编号").Width(200).HtmlAttributes(new { style = "text-align: center" }).ReadOnly(true);
            columns.Bound(r => r.RoomId).Title("房间编号").Width(100).HtmlAttributes(new {style = "text-align: center"});
            columns.Bound(r => r.ProductID).Title("商品编号").Width(100).HtmlAttributes(new { style = "text-align: center" });
            columns.Bound(r => r.ProductName).Title("商品名称").Width(100).HtmlAttributes(new { style = "text-align: center" }).ReadOnly(true);
            columns.Bound(r => r.ProductCount).Title("购买数量").Width(100).HtmlAttributes(new { style = "text-align: center" });
            columns.Bound(r => r.ConsumeDate).Title("消费时间").Width(200).HtmlAttributes(new { style = "text-align: center" }).ReadOnly(true).Format("{0:yyyy-MM-dd hh:mm:ss}");
            columns.Bound(r => r.PriceOut).Title("单价").Width(100).HtmlAttributes(new { style = "text-align: center" }).ReadOnly(true).Format("￥{0:N2}");
            columns.Bound(r => r.ProductCost).Title("单货品总价").Width(100).HtmlAttributes(new { style = "text-align: center" }).ReadOnly(true).Format("￥{0:N2}");
            columns.Bound(r => r.SumAccount).Title("消费总价").Width(100).HtmlAttributes(new { style = "text-align: center" }).ReadOnly(true).Format("￥{0:N2}");
            columns.Command(commands =>
            {
                commands.Edit().ButtonType(GridButtonType.ImageAndText);
                commands.Delete().ButtonType(GridButtonType.ImageAndText);
            }).Width(200).Title("操作");        })        .Pageable(page => page.PageSize(5))        .Sortable()
        .DataBinding(dataBinding => dataBinding.Ajax()                    .Select("ShowAllClientConsumptionInfoAjax", "ClientConsumption", new { roomId = ViewData["roomId"].ToString() })
                    .Delete("DeleteClientConsumptionInfo", "ClientConsumption")
                    .Update("UpdateClientConsumptionInfo", "ClientConsumption")                    )                    .ClientEvents(clientEvents => clientEvents.OnDataBinding("onDataBinding")
                                                  .OnEdit("OnEdit")
                                                  .OnDelete("OnDelete")
                                                  .OnRowDataBound("onRowDataBound")                                                  )        .Scrollable(scroll=>scroll.Height(295))        .Editable(edit=>edit.Mode(GridEditMode.InLine))        .Filterable()        .Render();}<script type="text/javascript">

    function dump(obj) {
        var result = [];
        $.each(obj, function (key, value) {
            //像数组中添加数据
             result.push(value);
         });
         //获取第五个数字，即：产品的个数
        return result.slice(3, 4);
    }
        var roomId;
        function onRowSelected(e) {
            var detailsGrid = $("#clientConsumptionDetails").data("tGrid");
            roomId = e.row.cells[0].innerHTML;
            $("#room").text("客房编号：" + roomId);
            detailsGrid.rebind({ roomId: roomId });
        }

        function OnDelete(e) {
            var productCount = dump(e.dataItem);
            $.ajax({
                url: '/ClientConsumption/EditProductCount',
                async: false,
                type: 'POST',
                data: { 'productCount': productCount[0] },
                dataType: 'text'
            });
        }
        
        function onDataBinding(e) {
          e.data = $.extend(e.data, { roomId: roomId });
      }
      function onRowDataBound(e) {
          var detailsGrid = $("#clientConsumptionDetails").data("tGrid");
          if (detailsGrid != null) {
              var sumAccount = e.row.cells[8].innerHTML;
              $("#sumAccount").text("消费总价：" + sumAccount + " 元");
          }
         else {
             $("#sumAccount").text("消费总价：0 元");
          }
       }</script><script type="text/javascript">
    function OnEdit() {
        //给input增加属性和样式
        $("#RoomId").attr("readonly", "readonly");
        $("#RoomId").css({ "background-color": "yellow" });
        $("#ProductID").css({ "background-color": "yellow" });
        $("#ProductID").attr("readonly", "readonly");
       
    }
    
</script>